import React from 'react';
import CodePreview from '@/components/CodeOptimizePreview';
import UnoptimizedDemo from './Unoptimized';
import OptimizedDemo from './Optimized';

// 使用 Umi 的方式导入源代码
// @ts-ignore
import unoptimizedCode from '!!raw-loader!./Unoptimized.tsx';
// @ts-ignore
import optimizedCode from '!!raw-loader!./Optimized.tsx';

const UseMemoExample: React.FC = () => {
  return (
    <CodePreview
      title="useMemo 优化示例"
      beforeCode={unoptimizedCode}
      afterCode={optimizedCode}
      BeforeComponent={UnoptimizedDemo}
      AfterComponent={OptimizedDemo}
    />
  );
};

export default UseMemoExample;
